<!DOCTYPE html>
<html>

	<head>
		<!-- 声明文档使用的字符编码 -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<!-- 为移动设备添加 viewport -->
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
		<meta name="HandheldFriendly" content="true">
		<!-- 优先使用 IE 最新版本和 Chrome -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<title>黑图视界</title>
		<meta name="keywords" content="黑图视界">
		<meta name="description" content="黑图视界">
		<script type="text/javascript" src="../js/setFontSize.js"></script>
		<link rel="stylesheet" href="../css/swiper.min.css" />
		<link rel="stylesheet" href="../css/main.css" />
	</head>

	<body>
		<div id="app">
			<main class="pab150">
				<section class="personInfo picBg">
					<div class="container">
						<div class="radius20 whiteBg pad30 pab80">
							<div class="item">
								<div class="txBox">
									<img :src="loginUser.src" class="objectCover" @click="selectFile"/>
									<div>点击头像可更换头像</div>
									<form action="/user/photo" method="post" enctype="multipart/form-data" id="fileForm">
										<input id="fileBox" type="file" name="photoFile" style="display: none" @change="submit()">
									</form>
								</div>
							</div>
							<div class="item clearfix">
								<div class="name">姓名：</div>
								<div class="des">{{loginUser.realname}}</div>
							</div>
							<div class="item clearfix">
								<div class="name">生日：</div>
								<div class="des">{{loginUser.birthday}}</div>
							</div>
							<div class="item clearfix">
								<div class="name">电话：</div>
								<div class="des">{{loginUser.phonenum}}</div>
							</div>
							<div class="item clearfix">
								<div class="name">身份证号码：</div>
								<div class="des">{{loginUser.identitynum}}</div>
							</div>
							<div class="item clearfix">
								<div class="name">性别：</div>
								<div class="des" v-show="loginUser.sex==0">男</div>
								<div class="des" v-show="loginUser.sex==1">女</div>
							</div>
							<div class="icon" id="noticeBtn"></div>
						</div>
					</div>
				</section>
				<section class="notice">
					<div class="mask"></div>
					<div class="flexBox">
						<div class="box">
							<img src="../img/noticeBg.jpg" class="pic" />
							<div class="txt">如需更改个人信息，</br>请联系管理员<a href="tel:010-12345678">010-12345678</a></div>
							<div class="btn infoClose">确认</div>
							<div class="close infoClose"></div>
						</div>
					</div>
				</section>
			</main>
		</div>

		<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="../js/swiper.min.js"></script>
		<script type="text/javascript" src="../js/layer/layer.js" ></script>
		<script type="text/javascript" src="../js/main.js"></script>
		<script src="../js/vue.js"></script>
		<script src="../js/axios.js"></script>
		<script src="../js/getParameter.js"></script>
	</body>
	<script>
		let msg=getParameter("msg");
		if(msg==="noUser") layer.msg("请先登录用户")
		if(msg==="noPhoto") layer.msg("请上传jpg图片")
		if(msg==="success") layer.msg("上传成功")
		if(msg==="fail") layer.msg("上传失败")
		let loginId = getParameter("id");
		if (loginId===null) location.href = "/userclient/login.html"
		const app = new Vue({
			el:"#app",
			data:{
				loginUser:{}
			},
			methods:{
				selectFile(){
					$("#fileBox").click();
				},
				submit(){
					$("#fileForm").submit();
				}
			},
			created(){
				axios.get("/user/find/"+loginId).then(function (res) {
					if (JSON.stringify(res.data)==='""') location.href = "/userclient/login.html"
					else app.loginUser = res.data
				})
			}
		})
	</script>
</html>